<template name="selectAre">
	<view class="display flow themeBgColor selectAre borderB">
		<view v-for="(item,index) in selectList" :key="index" @click="selectClick(index)">
			<text>{{item.text}}</text>
			<view :class="[current==index?'line': '']"></view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "selectAre",
		props: ['selectList','current'],
		data() {
			return {
			};
		},
		methods:{
			selectClick(index){
				this.$emit('selectIndex',index)
			},
		}
	}
</script>

<style lang="scss">
	.selectAre{
		@include widthHeight(100%,65rpx);
		@include font($fontSize,white);
		@include padding(0 120rpx);
		align-content: center;
		.line{
			@include widthHeight(auto,5rpx);
			@include backG;
			@include margin(5rpx,'top');
		}
	}
	
</style>
